<template>
	<view class="container">

		<view class="des" style="margin-left: 10rpx;margin-right: 10rpx;">{{yue}}元</view>

		<!-- <view>
			<u-button class="buttonbox" text="提现" 
				customStyle="width: 600rpx" shape="circle" color="#534EA1">
			</u-button>
			
		</view> -->

		<view class="btn-box w100 fixed">
			<button class="btn btn-save" :disabled="!isclick" type="primary" @click="chongzhi">充值</button>
			<button class="btn btn-save" :disabled="!isclick" type="primary" @click="tixian">提现</button>
		</view>


		<view class="liushui">
			<block v-if="waters.length == 0">
				<view class="shoproempty">
					<shopro-empty :image="mediaUrl + '/media/image/empty_goods.png'" tipText="暂无~"></shopro-empty>
				</view>
			</block>
			<block v-else>
			
				<u-list>
					<u-list-item v-for="(item, index) in waters" :key="index">
						<view class="box flex">
							<!-- <view class="left">
								<u-avatar shape="square" :src="mediaUrl+item.avatar"></u-avatar> 
							</view> -->
							<view class="des">
								<view class="content">{{item.descs}}</view>
								<view class="time">
									{{item.time}}
								</view>
							</view>
						</view>
					</u-list-item>
				</u-list>
			</block>
			
		</view>
		
		<!-- 底部按钮 end -->

	</view>
</template>

<script>
	var self
	export default {
		data() {
			return {
				mediaUrl: uni.$http.mediaUrl,
				yue: 0,
				waters: [],
				userInfo: uni.getStorageSync('userInfo') || null,

			};
		},
		onLoad(e) {},
		onShow() {
			this.getwater()
		},
		methods: {

			async getwater() {
				if (this.userInfo) {
					const userInfo = {
						username: this.userInfo.username,
					}
					const {
						data: res
					} = await uni.$http.post('getwaters/', userInfo)

					if (res.code == 200) {
						// console.log(res.data.userInfo) 
						this.yue = res.data.yue

						var num = res.data.waters.length
						var dest = [];
						for (let i = 0; i < num; i++) {

							var obj = {}
							// 时间,备注
							obj.time = res.data.waters[i].date_joined;
							obj.descs = res.data.waters[i].descs;
							this.waters.push(obj)
						}
					} else {
						// uni.showToast({ icon:'error', title: res.msg })
					}
				}

				// console.log(this.fileList1)
			},
		
		async chongzhi() {
					const userInfo = {
						username: this.userInfo.username,
					}
					const {
						data: res
					} = await uni.$http.post('chongzhi/', userInfo)
		
					if (res.code == 200) {
						uni.showToast({ icon:'success', title:'充值成功' })
						
					} else {
						// uni.showToast({ icon:'error', title: res.msg })
					}
		
				// console.log(this.fileList1)
			},
		async tixian() {
					const userInfo = {
						username: this.userInfo.username,
					}
					const {
						data: res
					} = await uni.$http.post('tixian/', userInfo)
		
					if (res.code == 200) {
						uni.showToast({ icon:'success', title: '提现成功' })
						
					} else {
						// uni.showToast({ icon:'error', title: res.msg })
					}
		
				// console.log(this.fileList1)
			},
		
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f2f2f2;

	}
	.liushui{
		position: relative;
		margin-top: 150rpx;
	}

	.tishi {
		font-size: 10px;
	}

	.fixed {
		top: 100rpx
	}

	.des {
		text-align: center;
		size: 20;
	}

	.box {
		font-size: 28rpx;
		background-color: #fff;
		padding: 20rpx 0;
		box-sizing: border-box;
		border-bottom: 2rpx solid #eee;

		.left {
			flex-shrink: 0;
		}

		.des {
			padding-left: 20rpx;
			flex: 1;
		}

		.time {
			font-size: 24rpx;
			color: #c1c1c1;
		}
	}

	textarea {
		min-height: 200rpx;
		text-align: left !important;
		width: 100%;
		padding: 20rpx;
		background-color: #F5F5F5;
		border-radius: 12rpx;
		box-sizing: border-box;

	}

	.item {
		.image-box {
			padding-left: 0;
		}

		.value {
			margin-top: 20rpx;
		}
	}
	.btn{
		position: relative;
		display: inline-block;
		width: 30%;
	}
	.btn-box {
		box-shadow: 0 0 12rpx rgba(132, 129, 200, .3);
	}

	.tips {
		color: red;
	}
</style>